<script lang="ts" setup>
  import { Popover } from 'ant-design-vue';
  import { currentyOptions } from '/@/views/common/commonSetting';
  import { computed } from 'vue';

  interface Props {
    record: any;
    keyIndex: string;
  }

  const props = defineProps<Props>();

  const amount = computed(() => props.record[props.keyIndex]);
</script>

<template>
  <Popover placement="right" color="rgba(0,0,0,0.8)">
    <template #content>
      <div class="text-white text-center">
        <span>参考币种：<span class="text-orange">{{
            currentyOptions[record.currency_id]
            }}</span></span>
        <div>{{ amount }}</div>
      </div>
    </template>
    <span>{{ amount }}{{ props.keyIndex }}</span>
  </Popover>
</template>

<style lang="less" scoped></style>
